import 'package:flutter/material.dart';

class LoginInput extends StatefulWidget {
  final String title;
  final String hint;
  final ValueChanged<String>? onChanged;
  final ValueChanged<bool>? foucsChanged;
  final bool lineStretch;
  final bool obscureText;
  final TextInputType keyboardType;

  const LoginInput(this.title, this.hint,
      {Key? key,
      this.onChanged,
      this.foucsChanged,
      this.lineStretch = false,
      this.obscureText = false,
      this.keyboardType = TextInputType.text})
      : super(key: key);

  @override
  State<LoginInput> createState() => _LoginInputState();
}

class _LoginInputState extends State<LoginInput> {
  final _foucsNode = FocusNode();

  @override
  void initState() {
    // TODO: implement initState
    super.initState();
    _foucsNode.addListener(() {
      print("Has foucs: ${_foucsNode.hasFocus}");
      if(widget.foucsChanged != null) {
        widget.foucsChanged!(_foucsNode.hasFocus);
      }
    });
  }

  @override
  void dispose() {
    // TODO: implement dispose
    _foucsNode.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Column(
      children: [
        Container(
          height: 48,
          child: Row(
            children: [
              Container(
                padding: const EdgeInsets.only(left: 15),
                width: 90,
                child: Text(
                  widget.title,
                  style: const TextStyle(fontSize: 16),
                ),
              ),
              _input()
            ],
          ),
        ),
        Padding(
          padding: EdgeInsets.only(left: !widget.lineStretch ? 16 : 0),
          child: const Divider(
            height: 1,
            thickness: 0.5,
          ),
        )
      ],
    );
  }

  _input() {
    return Expanded(
        child: TextField(
      focusNode: _foucsNode,
      onChanged: widget.onChanged,
      obscureText: widget.obscureText,
      keyboardType: widget.keyboardType,
      autofocus: !widget.obscureText,
      style: const TextStyle(
          fontSize: 16, color: Colors.black, fontWeight: FontWeight.w300),
      decoration: InputDecoration(
          contentPadding: const EdgeInsets.only(left: 20, right: 20),
          border: InputBorder.none,
          hintText: widget.hint,
          hintStyle: const TextStyle(fontSize: 15, color: Colors.grey)),
    ));
  }
}
